<template>
  <div>
    <zm-panel title="员工详情" :visible.sync="value" @change="close">
      <zm-form label-width="100px" :model="form" ref="zmForm">
        <h3>账号信息</h3>
        <zm-form-item label="员工姓名">
          <span>{{ form.realName }}</span>
        </zm-form-item>
        <zm-form-item label="员工账号">
          <span>{{ form.userName }}</span>
        </zm-form-item>
        <zm-form-item label="手机号码">
          <span>{{ form.mobile }}</span>
        </zm-form-item>
        <zm-form-item label="员工状态">
          <span>{{ form.statusName }}</span>
        </zm-form-item>
        <zm-form-item label="创建日期">
          <span>{{ form.createTIme }}</span>
        </zm-form-item>

        <h3>部门权限</h3>
        <zm-form-item label="所属公司">
          <span>{{ form.companyName }}</span>
        </zm-form-item>
        <zm-form-item label="所属部门">
          <span>{{ form.apartmentName }}</span>
        </zm-form-item>
        <zm-form-item label="所属岗位">
          <span>{{ form.roleName }}</span>
        </zm-form-item>
         <zm-form-item label="数据权限">
          <span>{{form.dateAuthName}}</span>
          <div v-if="form.dateAuth === '4'">{{form.dateApartmentIdName}}</div>
        </zm-form-item>
        <zm-form-item label="菜单权限" prop="treeList">
          <permission-tree
            v-if="treeList && treeList.length > 0"
            v-model="form.menuIds"
            :tree="treeList"
            :is-checkbox="false"
          ></permission-tree>
        </zm-form-item>
      </zm-form>
      <div slot="footer" class="tr">
        <el-button @click="close">返回</el-button>
      </div>
    </zm-panel>
  </div>
</template>

<script>
import PermissionTree from '@/components/PermissionTree'
import panelMixin from '@/mixins/panelMixin'
import systemAccountApis from '@/api/src/systemAccount'
import systemMenu from '@/api/src/systemMenu'

export default {
  components: { PermissionTree },
  mixins: [panelMixin],
  props: {
    rowInfo: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      form: {},
      treeList: []
    }
  },
  created () {
    this.getDetail()
  },
  methods: {
    async getDetail () {
      const _res = await systemAccountApis.getInfo({ id: this.rowInfo.id })
      this.form = _res
      this.getPermissionTree(this.form.menuIds)
    },
    async getPermissionTree (menuIds) {
      let _res = []
      _res = await systemMenu.getMenuTree({
        menuIds: menuIds
      })
      this.treeList = _res || []
    }
  }
}
</script>
